<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>调度任务管理</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <script src="/style/public/publicStyle.js"></script>

    <script>
        /*layui.use(['form'], function() {
            var form = layui.form,
                $ = layui.jquery;
            $(function() {
                if(pageloadauthority("/views/jobgroup.html")==true){
                    $("body").attr("style","display:block;");
                    return;
                }
                atuLoginToken();
            })
        });*/
    </script>
    <style type="text/css">
        .layui-table-tool-panel li .layui-form-checkbox[lay-skin=primary] {
            /* width: 100%; */
            padding-left: 28px;
        }

        .layui-table-tool-panel li {
            line-height: 30px;
            -webkit-transition: .5s all;
            transition: .5s all;
            padding-left: 10px;
            padding-right: 47px;
        }
    </style>
</head>

<body>
<!--表格-->
<div class="weadmin-body">
    <div class="layui-row">
        <table class="layui-hide" id="tableDataList" lay-filter="usertab"></table>
    </div>
</div>

<!--表格操作-->
<script type="text/html" id="op">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="more">操作 <i class="layui-icon layui-icon-down"></i></a>
</script>

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-normal layui-btn-sm" lay-event="getCheckData">新增</button>
    </div>
</script>

<div class="layui-row" id="tableForm" style="display:none;">
    <div class="layui-col-md10">
        <form class="layui-form layui-from-pane" id="formId" style="margin-top:20px" lay-filter="tableForm">
            <input type="hidden" name="id"/>
            <p style="margin: 0 0 10px;text-align: left;border-bottom: 1px solid #e5e5e5;color: gray;">基础信息</p>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">执行器<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <select name="jobGroup" lay-filter="jobGroup" required id="jobGroup"
                                    nextId="naJobGroup"></select>
                            <!--<input type="hidden" name="jobGroup" id="naJobGroup"/>-->
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">任务描述<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="jobDesc" required lay-verify="required"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">负责人</label>
                        <div class="layui-input-block">
                            <input type="text" name="author" required lay-verify="required"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">警告邮件<font color="black">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="alarmEmail" class="layui-input">
                        </div>
                    </div>
                </div>
            </div>
            <p style="margin: 0 0 10px;text-align: left;border-bottom: 1px solid #e5e5e5;color: gray;"> 调度配置 </p>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">调度类型<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="scheduleType" value="CRON" disabled readonly class="layui-input layui-disabled">
                        </div>
                    </div>
                    <div class="layui-col-md6" id="scheduleConf">
                        <label class="layui-form-label">Cron表达式<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="scheduleConf" required lay-verify="required" placeholder="请输入CRON"
                                   autocomplete="off"
                                   class="layui-input" >
                        </div>
                    </div>
                </div>
            </div>
            <p style="margin: 0 0 10px;text-align: left;border-bottom: 1px solid #e5e5e5;color: gray;">任务配置</p>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">运行模式<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="interest" value="BEAN" disabled readonly class="layui-input layui-disabled">
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">JobHandler<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="executorHandler" required lay-verify="required"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md12">
                        <label class="layui-form-label">任务参数</label>
                        <div class="layui-input-block">
                            <textarea class="textarea form-control" name="executorParam" placeholder="" maxlength="512"
                                      style="width:95%;height: 63px; line-height: 1.2;"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <p style="margin: 0 0 10px;text-align: left;border-bottom: 1px solid #e5e5e5;color: gray;">高级配置</p>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">路由策略<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <select class="form-control valid" name="executorRouteStrategy" aria-invalid="false">
                                <option value="FIRST">第一个</option>
                                <option value="LAST">最后一个</option>
                                <option value="ROUND">轮询</option>
                                <option value="RANDOM">随机</option>
                                <option value="CONSISTENT_HASH">一致性HASH</option>
                                <option value="LEAST_FREQUENTLY_USED">最不经常使用</option>
                                <option value="LEAST_RECENTLY_USED">最近最久未使用</option>
                                <option value="FAILOVER">故障转移</option>
                                <option value="BUSYOVER">忙碌转移</option>
                                <option value="SHARDING_BROADCAST">分片广播</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">子任务ID<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="childJobId"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
            </div><!---->
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">调度过期策略<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <select class="form-control valid" name="misfireStrategy" aria-invalid="false">
                                <option value="DO_NOTHING" selected="">忽略</option>
                                <option value="FIRE_ONCE_NOW">立即执行一次</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">阻塞处理策略<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <select class="form-control valid" name="executorBlockStrategy" aria-invalid="false">
                                <option value="SERIAL_EXECUTION">单机串行</option>
                                <option value="DISCARD_LATER">丢弃后续调度</option>
                                <option value="COVER_EARLY">覆盖之前调度</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-md6">
                        <label class="layui-form-label">任务超时时间<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="executorTimeout" required lay-verify="required"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <label class="layui-form-label">失败重试次数<font color="red">*</font></label>
                        <div class="layui-input-block">
                            <input type="text" name="executorFailRetryCount" required lay-verify="required"
                                   autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-form-item" style="margin-top:40px">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-normal layui-btn-submit " lay-submit="" lay-filter="demo11">保存</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>

        </form>
    </div>
</div>
<div class="layui-row" id="jobTriggerModal" style="display:none;">
    <div class="modal-dialog ">
        <div class="modal-content">
            <div class="modal-body">
                <form class="form-horizontal form" role="form">
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <div class="layui-col-md11">
                                <label class="layui-form-label">任务参数<font color="black">*</font></label>
                                <div class="layui-input-block">
                            <textarea class="textarea form-control" id="execParam" name="executorParam"
                                      placeholder="请输入任务参数,为空则从任务中获取"
                                      maxlength="512"
                                      style="width:90%;height: 63px; line-height: 1.2;"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <div class="layui-col-md11">
                                <label class="layui-form-label">机器地址<font color="black">*</font></label>
                                <div class="layui-input-block">
                            <textarea class="textarea form-control" name="addressList" id="addressList"
                                      placeholder="请输入本次执行的机器地址，为空则从执行器获取" maxlength="512"
                                      style="width:90%;height: 63px; line-height: 1.2;"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="layui-form-item" style="margin-top:40px">
                        <div class="layui-input-block">
                            <button class="layui-btn  layui-btn-submit " lay-submit="" lay-filter="execute">保存</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/html" id="triggerStatusTpl">
    {{#  if(d.triggerStatus == 1 ){ }}
    <font style="color: #00FF00;font-weight:bold;">运行中</font>
    {{#  } else { }}
    <font style="color: #2c05ff;font-weight:bold;">停止</font>

    {{#  } }}

</script>
<script>
    layui.use(['dropdown', 'util', 'laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function () {
        var util = layui.util
            , dropdown = layui.dropdown
            , layer = layui.layer //弹层
            , table = layui.table //表格
            , form = layui.form;
        var logintoken = null;
        getSharreTieba_LoginToken();
        table.render({
            elem: '#tableDataList'
            , even: true //开启隔行背景
            , cellMinWidth: 80
            , toolbar: '#toolbarDemo'
            , url: '/jobinfo/pageList'
            , where: {
                LoginKey: logintoken,
            }
            , cols: [[
                , {field: 'id', title: 'ID', hide: true}
                , {field: 'jobDesc', title: '调度描述'}
                , {field: 'scheduleConf', title: 'Cron'}
                , {field: 'executorHandler', title: 'JobHandler'}
                , {field: 'author', title: '责任人'}
                , {field: 'childJobid', title: '子任务'}
                , {field: 'triggerStatus', title: '状态', templet: '#triggerStatusTpl'}
                , {field: 'executorTimeout', title: '超时时间'}
                , {fixed: 'right', title: '操作', align: 'center', toolbar: '#op'}
            ]]
            , page: true
        });


//监听行工具事件
        table.on('tool(usertab)', function (obj) { //注：tool 是工具条事件名，usertab 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent == 'more') {
                //更多下拉菜单
                dropdown.render({
                    elem: this
                    , show: true //外部事件触发即显示
                    , data: [{
                        title: '启动计划'
                        , id: 'startPlan'
                    }, {type: '-'}, {
                        title: '启动'
                        , id: 'start'
                    }, {
                        title: '停止'
                        , id: 'stop'
                    }, {type: '-'}, {
                        title: '编辑'
                        , id: 'edit'
                    }, {
                        title: '删除'
                        , id: 'delete'
                    }]
                    , click: function (datas, othis) {
                        //根据 id 做出不同操作
                        if (datas.id == 'execute') {
                            layer.open({
                                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                                type: 1,
                                title: "执行一次",
                                area: ['820px', '330px'],
                                content: $("#jobTriggerModal")//引用的弹出层的页面层的方式加载修改界面表单
                            });
                            //动态向表传递赋值可以参看文章进行修改界面的更新前数据的显示，当然也是异步请求的要数据的修改数据的获取
                            setTriggerValue(obj, null);
                        } else if (datas.id == 'selectLog') {
                            window.location.href = "joblog.html";

                        } else if (datas.id == 'edit') {
                            layer.open({
                                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                                type: 1,
                                title: "编辑任务调度",
                                area: ['820px', '630px'],
                                content: $("#tableForm")//引用的弹出层的页面层的方式加载修改界面表单
                            });
                            //动态向表传递赋值可以参看文章进行修改界面的更新前数据的显示，当然也是异步请求的要数据的修改数据的获取
                            //
                            setFormValue(obj, data);
                        } else if (datas.id == 'delete') {
                            layer.confirm('确定删除 ' + data.jobDesc + ' 吗？', {
                                btn: ['确定', '取消'], //按钮
                            }, function () {
                                layer.closeAll('dialog');
                                $.ajax({
                                    type: "get",
                                    url: "/jobinfo/remove",
                                    async: true,
                                    data: {'id': data.id},
                                    success: function (json) {
                                        table.reload("tableDataList");
                                    }
                                });
                            });
                        } else if (datas.id == 'copy') {
                            layer.open({
                                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                                type: 1,
                                title: "新增",
                                area: ['820px', '630px'],
                                content: $("#tableForm")//引用的弹出层的页面层的方式加载修改界面表单
                            });
                            //动态向表传递赋值可以参看文章进行修改界面的更新前数据的显示，当然也是异步请求的要数据的修改数据的获取
                            data.id = 'add';
                            setFormValue(obj, data);
                        } else if (datas.id == 'start') {
                            layer.confirm('您将启动任务 ' + data.jobDesc + ' 是否继续？', {
                                btn: ['继续', '取消'], //按钮
                            }, function () {
                                layer.closeAll('dialog');
                                $.ajax({
                                    type: "get",
                                    url: "/jobinfo/start",
                                    async: true,
                                    data: {'id': data.id},
                                    success: function (json) {
                                        table.reload("tableDataList");
                                    }
                                });
                            });
                        } else if (datas.id == 'stop') {
                            layer.confirm('确定停止任务 ' + data.jobDesc + ' 吗？', {
                                btn: ['确定', '取消'], //按钮
                            }, function () {
                                layer.closeAll('dialog');
                                $.ajax({
                                    type: "get",
                                    url: "/jobinfo/stop",
                                    async: true,
                                    data: {'id': data.id},
                                    success: function (json) {
                                        table.reload("tableDataList");
                                    }
                                });
                            });
                        } else if (datas.id == 'startPlan') {
                            layer.closeAll('dialog');
                            $.ajax({
                                type: "get",
                                url: "/jobinfo/nextTriggerTime",
                                async: true,
                                data: {'scheduleType': data.scheduleType, 'scheduleConf': data.scheduleConf},
                                success: function (data) {

                                    if (data.code != 200) {
                                        layer.open({
                                            title: '调度执行计划',
                                            btn: ['确定'],
                                            content: data.msg
                                        });
                                    } else {
                                        var html = '<center>';
                                        if (data.code == 200 && data.content) {
                                            for (var index = 0; index < data.content.length; index++) {
                                                html += '<span>' + data.content[index] + '</span><br>';
                                            }
                                        }
                                        html += '</center>';

                                        layer.open({
                                            title: '调度执行计划',
                                            btn: ['确定'],
                                            content: html
                                        });
                                    }

                                }
                            });
                        }
                    }
                    , align: 'right' //右对齐弹出（v2.6.8 新增）
                    , style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' //设置额外样式
                });
            }
        });
//监听表头
        table.on('toolbar(usertab)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'getCheckData':
                    layer.open({
                        //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                        type: 1,
                        title: "新增调度管理",
                        area: ['820px', '630px'],
                        content: $("#tableForm")//引用的弹出层的页面层的方式加载修改界面表单
                    });
                    setFormValue(obj, {'id': 'add'});
                    break;
            }
            ;
        });
        form.on('select(scheduleType)', function (data) {

            if (data.value == "NONE") {
                document.getElementById("scheduleConf").style.display = "none";
                document.getElementById("schedule_conf_fix_rate").style.display = "none";
            } else if (data.value == "CRON") {
                document.getElementById("scheduleConf").style.display = "block";
                document.getElementById("schedule_conf_fix_rate").style.display = "none";
            } else if (data.value == "FIX_RATE") {
                document.getElementById("scheduleConf").style.display = "none";
                document.getElementById("schedule_conf_fix_rate").style.display = "block";
            }
        });

        //监听弹出框表单提交，massage是修改界面的表单数据'submit(demo11),是修改按钮的绑定
        function setFormValue(obj, data) {
            var url;
            if (data == null) {
                $("#formId")[0].reset();
            } else {
                form.val("tableForm", data);
            }


            form.on('submit(demo11)', function (massage) {
                var data = massage.field;
                if (massage.field.id != 'add') {
                    url = '/jobinfo/update';

                } else {
                    url = '/jobinfo/add';
                    delete data.id;

                }
                $.ajax({
                    url: url,
                    type: 'post',
                    dataType: 'json',
                    contentType: 'application/json;charset=UTF-8',
                    data: JSON.stringify(data),
                    success: function (msg) {
                        if (msg.code == "200") {
                            layer.open({
                                title: '系统提示',
                                btn: ['确定'],
                                content: '操作成功',
                                icon: '1',

                            });
                            table.reload("tableDataList");
                        } else {
                            layer.open({
                                title: '系统提示',
                                btn: ['确定'],
                                content: (data.msg || '操作失败'),
                                icon: '2'
                            });
                        }

                    }
                })
            })
        }

        function setTriggerValue(obj, data) {

            if (data == null) {
                $("#formId")[0].reset();
            } else {
                form.val("tableForm", data);
            }
            form.on('submit(execute)', function (massage) {
                var execParam = document.getElementById("execParam").value;
                var addressList = document.getElementById("addressList").value;
                var data = {
                    "id": obj.data.id,
                    "executorParam": execParam,
                    "addressList": addressList
                };
                $.ajax({
                    type: 'GET',
                    url: "/jobinfo/trigger",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        if (data.code == 200) {
                            layer.msg('执行一次成功');
                        } else {
                            layer.msg('执行一次失败');
                        }
                    }
                });
            })
        }

        $("#jobTriggerModal").on('hide.bs.modal', function () {
            $("#jobTriggerModal .form")[0].reset();
        });


    });
    //加载字典项
    layui.use('form', function () {
        var $ = layui.$;
        var form = layui.form;
        $.ajax({
            url: '/jobgroup/find',
            type: 'get',
            success: function (data1) {
                var data = data1.data; //提出返回数据中的data
                $("#jobGroup").empty();//清空默认值
                if (data !== null) {
                    var flag = true;
                    $.each(data, function (index, item) { //循环加入 data的元素
                        $("#jobGroup").append("<option value='" + item.id + "'>" + item.appname + "</option>");
                        if (flag) {
                            $("#naJobGroup").val(item.appname);
                            flag = false;
                        }
                    });
                }
                ;
            }
        });

    });

</script>
<style>
    .layui-form-label {
        float: left;
        display: block;
        padding: 9px 15px;
        width: 100px;
        font-weight: 400;
        line-height: 20px;
        text-align: right;
    }

    .layui-input, .layui-textarea {
        display: block;
        width: 80%;
        padding-left: 10px;
    }
</style>
</html>